<!--长效养护-->
<template>
  <page-meta
    :page-font-size="baseFontSize + 'rpx'"
    :root-font-size="baseFontSize + 'rpx'"
  ></page-meta>
  <view class="app-container">
    <!-- 审批信息 -->
    <uni-card
      class="box-card"
      :title="`审批任务【${item.name}】`"
      v-loading="processInstanceLoading"
      v-for="(item, index) in runningTasks"
      :key="index"
    >
      <uni-forms
        :ref="'form' + index"
        :model="auditForms[index]"
        :rules="auditRule"
        label-width="110px"
      >
        <uni-forms-item label="流程名" v-if="processInstance && processInstance.name">{{
          processInstance.name
        }}</uni-forms-item>
        <uni-forms-item
          label="流程发起人"
          v-if="processInstance && processInstance.startUser"
        >
          {{ processInstance.startUser.nickname }}
          <!-- <el-tag type="info" size="mini">{{ processInstance.startUser.deptName }}</el-tag> -->
          <uni-tag :text="processInstance.startUser.deptName"></uni-tag>
        </uni-forms-item>
        <uni-forms-item label="审批建议" name="reason" required>
          <!-- <el-input type="textarea" v-model="auditForms[index].reason" placeholder="请输入审批建议" /> -->
          <uni-easyinput
            type="textarea"
            v-model="auditForms[index].reason"
            placeholder="请输入审批建议"
          ></uni-easyinput>
        </uni-forms-item>
        <uni-forms-item
          label="处置意见"
          name="dealMsg"
          v-if="
            processInstance.name &&
            processInstance.name.indexOf('案卷') > -1 &&
            tasks &&
            tasks[0] &&
            tasks[0].name &&
            (tasks[0].name.indexOf('监理') > -1 || tasks[0].name.indexOf('业主') > -1) &&
            form.taskId == -1
          "
        >
          <!-- <el-select v-model="auditForms[index].dealMsg" placeholder="请选择处置意见">
						<el-option v-for="dict in getDictDatas(DICT_TYPE.DEAL_TYPE)" :key="dict.value" :label="dict.label" :value="dict.value" />
					</el-select> -->
          <song-data-picker
            placeholder="请选择处置意见"
            input-value
            popup-title="请选择处置意见"
            :placeholderStyle="placeholderStyle"
            :localdata="dealMsgOptions"
            :border="false"
            openSearch
            v-model="auditForms[index].dealMsg"
            @change="(e) => dealMsgChange(e, index)"
          ></song-data-picker>
        </uni-forms-item>
        <uni-forms-item
          label="期望完成时间"
          v-if="
            processInstance.name &&
            processInstance.name.indexOf('案卷') > -1 &&
            tasks &&
            tasks[0] &&
            tasks[0].name &&
            tasks[0].name.indexOf('监理') > -1 &&
            form.taskId == -1
          "
          name="expectEndDate"
          :required="isPass"
        >
          <!--  <el-date-picker clearable v-model="auditForms[index].expectEndDate" type="date" value-format="yyyy-MM-dd"
				    placeholder="选择期望完成时间" /> -->
          <uni-datetime-picker type="date" v-model="auditForms[index].expectEndDate" />
        </uni-forms-item>

        <!-- 当到了施工负责人节点的时候 需要施工负责人做案卷任务分配  end-->
        <div v-if="tasks[0] && tasks[0].name && tasks[0].name.indexOf('施工单位') > -1">
          <uni-forms-item label="任务名称">{{ taskObj.taskName }}</uni-forms-item>
          <uni-forms-item label="养护项目" name="projectManageId">{{
            taskObj.projectName
          }}</uni-forms-item>
          <uni-forms-item label="关联设施" name="facilityId">
            <div>{{ form.facilityName }}</div>
          </uni-forms-item>
          <uni-forms-item label="案卷来源" name="caseIds">
            <div>{{ form.caseCode }}</div>
          </uni-forms-item>
          <uni-forms-item
            label="期望完成时间"
            name="expectEndDate"
            v-if="!expectEndDate || expectEndDate == 'undefined'"
          >
            <uni-datetime-picker type="date" v-model="auditForms[index].expectEndDate" />
          </uni-forms-item>
          <uni-forms-item label="期望完成时间" v-else>{{ expectEndDate }}</uni-forms-item>
          <uni-forms-item label="维修方案"
            ><uni-easyinput
              type="textarea"
              v-model="taskObj.content"
              placeholder="请输入维修方案"
            ></uni-easyinput
          ></uni-forms-item>
          <uni-forms-item label="任务分配" name="taskUserId" :required="isPass">
            <song-data-picker
              placeholder="请选择人员"
              input-value
              popup-title="请选择人员"
              :placeholderStyle="placeholderStyle"
              :localdata="userOptions"
              :border="false"
              openSearch
              v-model="taskUserNickname"
              @change="taskChange"
            ></song-data-picker>
          </uni-forms-item>
        </div>
      </uni-forms>
      <div class="flex justify-around">
        <view
          style="background-color: #13ce66"
          class="btn"
          @click="handleAudit(item, true)"
          >通过</view
        >
        <view
          style="background-color: #e64340"
          class="btn"
          @click="handleAudit(item, false)"
          >不通过</view
        >
        <!-- <button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleUpdateAssignee(item)">转办</button> -->
        <song-data-picker
          placeholder="转办"
          :extend="item"
          popup-title="转办"
          :placeholderStyle="placeholderStyle"
          :localdata="userOptions"
          @change="handleUpdateAssignee"
          isShowFooter
          openSearch
        >
          <view class="btn">转办</view>
        </song-data-picker>
      </div>
    </uni-card>
    <!-- 申请信息 -->
    <uni-card
      class="box-card"
      :title="'申请信息【' + processInstance.name + '】'"
      v-loading="processInstanceLoading"
    >
      <view
        v-if="
          processInstance.processDefinition &&
          processInstance.processDefinition.formType === 20
        "
      >
        <view class="case-detail" v-if="form.taskId == -1"
          ><caseDetail :form="form"></caseDetail
        ></view>
        <view class="case-detail" v-else>
          施工详情
          <view v-for="item in taskDetail.handleCases"
            ><constructionDetail :cDetail="item"></constructionDetail
          ></view>
          任务详情
          <taskDetail :taskDetail="taskDetail"></taskDetail>
        </view>
      </view>
    </uni-card>
    <!-- 审批记录 -->
    <uni-card class="box-card" title="审批记录" v-loading="tasksLoad">
      <view><taskTimeline :tasks="tasks"></taskTimeline></view>
    </uni-card>
  </view>
</template>

<script>
import {
  createDmTask,
  getDmTaskPage,
  getCaseManageApi,
  getProcessDefinitionBpmnXML,
  getDmProjectManagePage,
  getProcessInstance,
  approveTask,
  setExpect,
  getTaskListByProcessInstanceId,
  rejectTask,
  updateTaskAssignee,
  queryExpect,
  listSimpleUsers,
  getActivityList,
  batchUpdateStatus
} from '@/api/common.js';
import constructionDetail from './constructionDetail';
import taskDetail from './taskDetail';
import taskTimeline from './taskTimeline';
import caseDetail from './caseDetail.vue';
import { DICT_TYPE, getDictDatas } from '@/utils/dict';
import store from '@/store';
import { decodeFields } from '@/utils/util';
import { getDate } from '@/utils/util';
// 流程实例的详情页，可用于审批
export default {
  name: 'ProcessInstanceDetail',
  components: {
    // taskSetModal,
    taskDetail,
    constructionDetail,
    taskTimeline,
    caseDetail
  },
  data() {
    return {
      isPass: true,
      expectEndDate: null,
      taskObj: {
        maintenanceLevel: '1',
        projectName: '',
        taskName: '',
        expectEndDate: null,
        content: null,
        taskUserId: null,
        taskUserNickname: null,
        projectManageId: null
      },
      form: {
        brokenImg: []
      },
      taskDetail: {},
      // 遮罩层
      processInstanceLoading: true,
      // 流程实例
      id: undefined, // 流程实例的编号
      processInstance: {},

      // 流程表单详情
      detailForm: {
        fields: []
      },

      // BPMN 数据
      bpmnXML: null,
      bpmnControlForm: {
        prefix: 'flowable'
      },
      activityList: [],

      // 审批记录
      tasksLoad: true,
      tasks: [],

      // 审批表单
      runningTasks: [],
      auditForms: [],
      auditRule: {
        reason: {
          rules: [{ required: true, errorMessage: '审批建议不能为空' }],
          validateTrigger: 'blur'
        },
        expectEndDate: {
          rules: [{ required: this.isPass, errorMessage: '期望完成时间不能为空' }],
          validateTrigger: ['blur', 'change']
        },
        taskUserId: {
          rules: [{ required: this.isPass, errorMessage: '期望完成时间不能为空' }],
          validateTrigger: ['blur', 'change']
        }
      },

      // 转派审批人
      userOptions: [],
      dealMsgOptions: [],
      updateAssignee: {
        open: false,
        form: {
          assigneeUserId: undefined
        },
        rules: {
          assigneeUserId: [
            { required: true, message: '新审批人不能为空', trigger: 'change' }
          ]
        }
      },
      taskUserNickname: ''
    };
  },
  computed: {
    baseFontSize() {
      return this.$store.getters.fontSize;
    }
  },

  created() {},
  onLoad(options) {
    this.id = options.id;
    if (!this.id) {
      uni.showToast({
        title: '未传递 id 参数，无法查看流程信息',
        icon: 'none'
      });
      return;
    }
    this.getDetail();

    // 获得用户列表
    this.userOptions = [];
    listSimpleUsers().then((response) => {
      this.userOptions = response.data.map((item) => {
        return {
          ...item,
          text: item.nickname,
          value: item.id
        };
      });
      console.log('this.userOptions', this.userOptions);
    });
    console.log('getDictDatas(DICT_TYPE.DEAL_TYPE)', getDictDatas(DICT_TYPE.DEAL_TYPE));
    this.dealMsgOptions = getDictDatas(DICT_TYPE.DEAL_TYPE).map((item) => {
      return {
        ...item,
        text: item.label
      };
    });
  },
  methods: {
    validtaskUserId(rule, value, callback) {
      // const index = this.runningTasks?.indexOf(task)
      if (!this.auditForms[0].taskUserId && this.isPass) {
        callback('任务分配人员不能为空');
      } else {
        callback();
      }
    },
    validExpectEndDate(rule, value, callback) {
      // const index = this.runningTasks?.indexOf(task)
      if (!this.auditForms[0].expectEndDate && this.isPass) {
        callback('期望完成时间不能为空');
      } else {
        callback();
      }
    },
    taskChange(data) {
      console.log(
        '%c [ data ]-317',
        'font-size:13px; background:pink; color:#bf2c9f;',
        data
      );
      if (data.detail.value && data.detail.value.length > 0) {
        let userInfo = data.detail.value[0];
        this.auditForms[0].taskUserId = userInfo.value;
        this.auditForms[0].taskUserNickname = userInfo.text;
      } else {
        this.auditForms[0].taskUserId = '';
        this.auditForms[0].taskUserNickname = '';
      }
      console.log(
        'this.auditForms[0].taskUserNickname',
        this.auditForms[0].taskUserNickname
      );
    },
    dealMsgChange(data, index) {
      if (data.detail.value && data.detail.value.length > 0) {
        let dealMsgInfo = data.detail.value[0];
        this.auditForms[index].dealMsg = dealMsgInfo.value;
      } else {
        this.auditForms[index].dealMsg = '';
      }
    },
    //获取项目名称
    async getProjectManage(facilityId) {
      const res = await getDmProjectManagePage({
        pageNo: 1,
        pageSize: 10,
        facilityId
      });
      this.taskObj.projectManageId = res.data?.list[0]?.projectManageId;
      this.taskObj.projectName = res.data?.list[0]?.projectName;
    },
    queryExpect() {
      const caseId = this.processInstance.businessKey;

      queryExpect(caseId).then((res) => {
        this.expectEndDate = res.data;
      });
    },
    /** 获取案卷详情 */
    getCaseDetail() {
      const id = this.processInstance.businessKey;
      if (this.processInstance.processDefinition?.id?.indexOf('task_manage') > -1) {
        this.getTaskDetail(id);
      } else {
        getCaseManageApi({
          pageNo: 1,
          pageSize: 1,
          id
        }).then((response) => {
          console.log(
            '%c [ response ]-334',
            'font-size:13px; background:pink; color:#bf2c9f;',
            response
          );
          let {
            lng,
            lat,
            deviceType,
            brokenImg,
            caseCode,
            facilityName,
            belongTo: facilityId
          } = response.data.list[0];
          this.form = {
            ...response.data.list[0],
            lnglat: `${lng},${lat}`,
            deviceType: parseInt(deviceType),
            brokenImg: brokenImg
              ? brokenImg?.split(',').map((item) => {
                  return {
                    url: item
                  };
                })
              : []
          };
          this.taskObj.taskName = `${facilityName}-${caseCode}`;
          if (this.form.taskId == -1 && this.tasks[0]?.name?.indexOf('施工单位') > -1) {
            this.getProjectManage(facilityId);
          }
          if (this.form.taskId > -1) {
            this.getTaskDetail(this.form.taskId);
          }
          this.auditForms.forEach((item) => {
            item.dealMsg = this.form.dealMsg;
          });
        });
      }
    },
    /** 获取任务详情 */
    getTaskDetail(id) {
      // const id = this.processInstance.businessKey;
      console.log('%c [ id ]-440', 'font-size:13px; background:pink; color:#bf2c9f;', id);
      let params = {
        pageNo: 1,
        pageSize: 10,
        taskType: 1,
        taskId: id
      };
      getDmTaskPage(params).then((response) => {
        console.log(
          '%c [ response ]-205',
          'font-size:13px; background:pink; color:#bf2c9f;',
          response
        );
        let resData = response.data.list[0];
        let {
          lng,
          lat,
          deviceType,
          brokenImg,
          caseCode,
          facilityName,
          belongTo: facilityId
        } = resData.cases[0];
        let handleCases = resData.cases.map((item) => {
          let {
            lng,
            lat,
            deviceType,
            brokenImg,
            caseCode,
            facilityName,
            belongTo: facilityId
          } = item;
          return {
            ...item,
            lnglat: `${lng},${lat}`,
            deviceType: parseInt(deviceType),
            brokenImg: brokenImg
              ? brokenImg?.split(',').map((item) => {
                  return {
                    url: item
                  };
                })
              : []
          };
        });
        this.taskDetail = {
          ...resData,
          handleCases,
          case: {
            ...resData.cases[0],
            lnglat: `${lng},${lat}`,
            deviceType: parseInt(deviceType),
            brokenImg: brokenImg
              ? brokenImg?.split(',').map((item) => {
                  return {
                    url: item
                  };
                })
              : []
          }
        };
      });
    },
    /** 获得流程实例 */
    getDetail() {
      // 获得流程实例相关
      this.processInstanceLoading = true;
      getProcessInstance(this.id).then((response) => {
        console.log('response', response);
        if (!response.data) {
          uni.showToast({
            title: '查询不到流程信息！',
            icon: 'none'
          });
          return;
        }
        // 设置流程信息
        this.processInstance = response.data;

        // 设置表单信息
        if (this.processInstance.processDefinition.formType === 10) {
          this.detailForm = {
            ...JSON.parse(this.processInstance.processDefinition.formConf),
            disabled: true, // 表单禁用
            formBtns: false, // 按钮隐藏
            fields: decodeFields(this.processInstance.processDefinition.formFields)
          };
          // 设置表单的值
          this.detailForm.fields.forEach((item) => {
            const val = this.processInstance.formVariables[item.__vModel__];
            if (val) {
              item.__config__.defaultValue = val;
            }
          });
        }

        // 加载流程图
        getProcessDefinitionBpmnXML(this.processInstance.processDefinition.id).then(
          (response) => {
            this.bpmnXML = response.data;
          }
        );

        //加载案卷详情
        // if (this.processInstance.name && this.processInstance.name.indexOf('案卷') > -1) {
        // 	this.getCaseDetail();
        // 	this.queryExpect();
        // }
        this.getCaseDetail();
        if (this.form.taskId == -1 || this.tasks[0]?.name?.indexOf('施工单位') > -1) {
          this.queryExpect();
        }
        //加载任务详情
        //  kio,iii'[n ]
        // 加载活动列表
        getActivityList({
          processInstanceId: this.processInstance.id
        }).then((response) => {
          this.activityList = response.data;
        });

        // 取消加载中
        this.processInstanceLoading = false;
      });

      // 获得流程任务列表（审批记录）
      this.tasksLoad = true;
      this.runningTasks = [];
      this.auditForms = [];
      console.log('审批记录');
      getTaskListByProcessInstanceId(this.id).then((response) => {
        // 审批记录
        console.log('审批记录123', response.data);
        this.tasks = [];
        // 移除已取消的审批
        response.data.forEach((task) => {
          if (task.result !== 4) {
            this.tasks.push(task);
          }
        });
        // 排序，将未完成的排在前面，已完成的排在后面；
        this.tasks.sort((a, b) => {
          // 有已完成的情况，按照完成时间倒序
          if (a.endTime && b.endTime) {
            return b.endTime - a.endTime;
          } else if (a.endTime) {
            return 1;
          } else if (b.endTime) {
            return -1;
            // 都是未完成，按照创建时间倒序
          } else {
            return b.createTime - a.createTime;
          }
        });

        // 需要审核的记录
        const userId = store.getters.userId;
        this.tasks.forEach((task) => {
          if (task.result !== 1) {
            // 只有待处理才需要
            return;
          }
          console.log(
            'userId',
            userId,
            !task.assigneeUser || task.assigneeUser.id !== userId
          );

          if (!task.assigneeUser || task.assigneeUser.id !== userId) {
            // 自己不是处理人
            return;
          }
          this.runningTasks.push({ ...task });
          this.auditForms.push({
            reason: '',
            dealMsg: ''
          });
        });
        this.$nextTick(() => {
          // 需要在onReady中设置规则
          if (this.$refs['form0'][0]) {
            this.$refs['form0'][0].setRules(this.auditRule);
          }
        });
        // 取消加载中
        this.tasksLoad = false;
        console.log('this.runningTasks', this.runningTasks);
      });
    },
    /** 处理审批通过和不通过的操作 */
    handleAudit(task, pass) {
      this.isPass = pass;
      const index = this.runningTasks?.indexOf(task);
      if (pass && this.auditForms[index].reason === '') {
        this.auditForms[index].reason = '通过';
      }
      if (!pass && this.auditForms[index].reason === '') {
        this.auditForms[index].reason = '驳回';
      }
      this.auditRule.expectEndDate.rules[0].required = this.isPass;
      this.auditRule.taskUserId.rules[0].required = this.isPass;
      this.$refs['form' + index][0].setRules(this.auditRule);
      this.$nextTick(() => {
        this.$refs['form' + index][0].validate().then(async (valid) => {
          console.log('valid', valid);
          if (!valid) {
            return;
          }
          const data = {
            id: task.id,
            reason: this.auditForms[index].reason
          };
          if (pass) {
            if (this.tasks[0]?.name?.indexOf('施工单位') > -1) {
              let res = await createDmTask(this.createTask());
              if (Number(res.code) != 0) {
                this.$modal.msgError(res.msg);
                return false;
              }
            }
            approveTask(data).then((response) => {
              if (
                this.processInstance.name &&
                this.processInstance.name.indexOf('案卷') > -1 &&
                this.tasks[0]?.name?.indexOf('监理') > -1
              ) {
                setExpect({
                  expectDate: this.auditForms[index].expectEndDate,
                  caseId: this.processInstance.businessKey
                }).then((res) => {
                  this.$modal.msgSuccess('审批通过成功！');
                });
              } else {
                this.$modal.msgSuccess('审批通过成功！');
              }
              // this.getDetail(); // 获得最新详情
              let timer = null;
              setTimeout(() => {
                uni.navigateBack();
                clearTimeout(timer);
              }, 1000);
            });
          } else {
            let processType = '',
              processInstanceId = task.id;
            if (
              this.processInstance.name &&
              this.processInstance.name.indexOf('案卷') > -1
            ) {
              processType = 'case_manage';
            }
            if (this.processInstance.name?.indexOf('任务') > -1) {
              processType = 'task_manage';
            }

            rejectTask({ ...data, processType }).then((response) => {
              this.$modal.msgSuccess('审批不通过成功！');
              // this.getDetail(); // 获得最新详情
              let timer = null;
              setTimeout(() => {
                uni.navigateBack();
                clearTimeout(timer);
              }, 1000);
            });
          }
          if (this.form.dealMsg != this.auditForms[index].dealMsg) {
            this.submitFormDeal(this.form.id, this.auditForms[index].dealMsg);
          }
        });
      });
    },
    /** 创建任务 */
    createTask() {
      this.form.projectManageId = parseInt(this.form.projectManageId);
      this.form.facilityId = parseInt(this.form.belongTo);
      let { id, belongTo: facilityId } = this.form;
      let { taskUserNickname, taskUserId } = this.auditForms[0];
      let { expectEndDate } = this;
      let { taskName, projectManageId, maintenanceLevel, content } = this.taskObj;
      let params = {
        facilityId,
        taskType: 1,
        caseIds: [id],
        taskName,
        projectManageId,
        taskUserNickname,
        taskUserId,
        expectEndDate,
        maintenanceLevel,
        content
      };
      // 添加的提交
      return { ...params };

      // if (Number(res.code) != 0) {
      //   this.$modal.msgError(res.msg)
      //   return false
      // } else {
      //   return true
      // }
    },
    /** 处理转派审批人 */
    handleUpdateAssignee(task) {
      // 设置表单
      console.log('task', task);
      this.updateAssignee.form.id = task.extend.id;
      this.updateAssignee.form.assigneeUserId = task.detail.value[0].value;
      this.submitUpdateAssigneeForm();
    },
    /** 提交转派审批人 */
    submitUpdateAssigneeForm() {
      updateTaskAssignee(this.updateAssignee.form).then((response) => {
        this.$modal.msgSuccess('转派任务成功！');
        this.updateAssignee.form = {
          id: '',
          assigneeUserId: ''
        };
        this.getDetail(); // 获得最新详情
      });
    },
    /** 取消转派审批人 */
    cancelUpdateAssigneeForm() {
      this.updateAssignee.open = false;
      this.resetUpdateAssigneeForm();
    },
    /** 重置转派审批人 */
    resetUpdateAssigneeForm() {
      this.updateAssignee.form = {
        id: undefined,
        assigneeUserId: undefined
      };
      this.resetForm('updateAssigneeForm');
    },
    /** 处理审批退回的操作 */
    handleDelegate(task) {
      this.$modal.msgError('暂不支持【委派】功能，可以使用【转派】替代！');
    },
    /** 处理审批退回的操作 */
    handleBack(task) {
      this.$modal.msgError('暂不支持【退回】功能！');
      // 可参考 http://blog.wya1.com/article/636697030/details/7296
      // const data = {
      //   id: task.id,
      //   assigneeUserId: 1
      // }
      // backTask(data).then(response => {
      //   this.$modal.msgSuccess("回退成功！");
      //   this.getDetail(); // 获得最新详情
      // });
    },
    /* 修改处置意见*/
    submitFormDeal(ids, dealMsg) {
      console.log('ids', ids, dealMsg);
      batchUpdateStatus({ ids: [ids], dealMsg: dealMsg });
    }
  },
  /* 用来设置 样式 /deep/ 起效 */
  options: {
    styleIsolation: 'shared'
  }
};
</script>

<style lang="scss" scoped>
@import '../richangxuncha/index.scss';
.list-area {
  height: 300upx;
}

.u-page {
  background: #fff;
  height: 100vh;
  font-size: 2.8rem;
}

.top-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #fff;
  padding: 0 22upx;
}

.btn {
  color: #fff;
  width: 160upx;
  background: #597ef7;
  border-radius: 8upx;
  color: #fff;
  font-size: 2.8rem;
  line-height: 2.3;
  text-align: center;
}

/deep/.uni-searchbar {
  background: #f1f1f1;
}
.fontList {
  position: fixed;
  display: flex;
  justify-content: space-around;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 30upx 20upx;
  background: #fff;
}
.time view:nth-of-type(2) {
  display: flex;
  margin: 10upx 0;
  img {
    width: 200upx;

    margin-right: 5upx;
  }
}
/deep/ .uni-searchbar__box-search-input {
  height: 40upx !important;
}
.img-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  grid-gap: 40rpx;
  gap: 40rpx;
  img {
    width: 66px;
  }
}
.my-process-designer {
  height: calc(100vh - 200px);
}

.box-card {
  width: 100%;
  margin-bottom: 20px;
}

.app-container .el-input.is-disabled .el-input__inner {
  background-color: transparent;
  border-color: transparent;
  color: #000;
  cursor: default;
}
// /deep/ .uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title,
// /deep/ .uni-easyinput__content-textarea,
// /depp/ .uni-data-tree-input .input-value .selected-area,
// .placeholderStyle {
// 	font-size: 2.8rem !important;
// }
// /deep/ .uni-forms-item__label,
// /deep/ .uni-forms-item__content {
// 	font-size: 2.8rem;
// 	height: auto;
// }
/deep/ .uni-tag {
  display: inline-block;
}
</style>
